<template>
	<view>
		<home v-if="PageCur=='home'" :city="city" @NavChangeHome="NavChangeHome"></home>
		<scriptList v-if="PageCur=='script'"></scriptList>
		<business v-if="PageCur=='business'"></business>
		<me v-if="PageCur=='me'"></me>

		<drag-button v-show="!show&&PageCur=='home' || !show&&PageCur=='business'" :isDock="true" :text="''" :existTabBar="true" @btnClick="btnClick">
			<block slot="content">
				<view class='text-center' v-show="PageCur=='home'">
					<image src="/static/icon/wx.png" style="width:80rpx;height:80rpx"></image>
				</view>
				<view class='text-center' v-show="PageCur=='business'">
					<image src="/static/icon/business.png" style="width:60rpx;height:60rpx"></image>
				</view>
				<view v-show="PageCur=='home'" class="text-xs cu-tag radius sm bg-grey">
					剧梦剧本杀群
				</view>
				<view v-show="PageCur=='business'" class="text-xs cu-tag radius sm bg-grey">
					{{vuex_user.unionId==1?'我的店铺':'店铺入驻'}}
				</view>
			</block>
		</drag-button>

		<van-popup round :show="show" @close="onClose">
			<view class="popup">
				<view v-if="CustomerId==-1">
					<view class="title">
						添加客服
					</view>
					<view class="content">
						添加一下任意客服微信，进剧本杀群，组局侃本更方便~
					</view>
					
					<view class="nt1" v-for="(item,index) in CustomerList" :key="index" v-if="index<2" @click="select(index)">
						<text class="cu-avatar lg round margin-left margin-right"
							:style="'background-image: url('+$isHttp(item.head_por)+');'"></text>客服{{item.name}}<text class="lg text-gray cuIcon-right"></text>
					</view>
				</view>
				<view v-if="CustomerId!=-1">
					<view class="title">
						<text class="cu-avatar lg round margin-lr-xs"
							:style="'background-image: url('+$isHttp(CustomerList[CustomerId].head_por)+');'"></text>客服{{CustomerList[CustomerId].name}}
					</view>
					<view class="content text-center">
						微信号：{{CustomerList[CustomerId].contactInfo}}
					</view>
					<button class="cu-btn round bg-cyan flex justify-center"  @click="$copy(CustomerList[CustomerId].contactInfo)">点击复制</button>
					<image style="width:420rpx;height:420rpx" :src="$isHttp(CustomerList[CustomerId].ewmImg)"></image>
					
				</view>
			</view>
		</van-popup>

		<view class="cu-bar tabbar  shadow foot" style="background-color: rgba(247, 247, 247, 1.0);">
			<view class="action" @click="NavChange" data-cur="home">
				<view class='cuIcon-cu-image'>
					<image :src="'/static/tabbar/home' + [PageCur=='home'?'_cur':''] + '.png'"></image>
				</view>
				<view :class="PageCur=='home'?'text-white1':'text-gray'">首页</view>
			</view>
			<view class="action" @click="NavChange" data-cur="script">
				<view class='cuIcon-cu-image'>
					<image :src="'/static/tabbar/script' + [PageCur=='script'?'_cur':''] + '.png'"></image>
				</view>
				<view :class="PageCur=='script'?'text-white1':'text-gray'">剧本列表</view>
			</view>
			<view class="action" @click="NavChange" data-cur="business">
				<view class='cuIcon-cu-image'>
					<image :src="'/static/tabbar/business' + [PageCur=='business'?'_cur':''] + '.png'"></image>
				</view>
				<view :class="PageCur=='business'?'text-white1':'text-gray'">商家列表</view>
			</view>
			<view class="action" @click="NavChange" data-cur="me">
				<view class='cuIcon-cu-image'>
					<image :src="'/static/tabbar/me' + [PageCur == 'me'?'_cur':''] + '.png'"></image>
				</view>
				<view :class="PageCur=='me'?'text-white1':'text-gray'">个人中心</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				PageCur: 'home',
				show: false,
				
				CustomerList:[],
				CustomerId:-1,
			}
		},
		methods: {
			NavChange: function(e) {
				uni.vibrateShort()
				this.PageCur = e.currentTarget.dataset.cur
				this.onClose()
			},
			NavChangeHome(e){
				uni.vibrateShort()
				this.PageCur=e
				
			},
			btnClick(e) {
				if (this.PageCur==='home'){
					this.showPopup()
					this.$u.api.getCustomerInfo().then(res=>{
						this.CustomerList=res.data
					})
				}else{
					this.$goPageIsLoginOk('/pageB/business/StoreEntry')
				}
			},
			select(index){
				this.CustomerId=index
			},
			showPopup() {
				this.show = true
			},
			onClose() {
				this.show = false
				this.CustomerId=-1
			},
		},
		onLoad() {
			
		}
	}
</script>

<style lang="scss" scoped>
	.popup {
		width: 500rpx;
		height: auto;
		padding: 30rpx 40rpx;

		.title {
			width: 100%;
			text-align: center;
			font-size: 36rpx;
		}

		.content {
			margin-top: 20rpx;
		}

		.nt1 {
			margin-top: 10rpx;
			background-color: #f5f5f5;
			border-radius: 20rpx;
			padding: 20rpx 10rpx 20rpx 0;
			font-size: 32rpx;
			
		}
	}
</style>
